<template>
  <div class="box">
        <header>
            <van-nav-bar left-arrow title="评价详情" @click-left="fant"> </van-nav-bar>
        </header>
        <main>
            <div class="appraise" v-for="(item,index) in list as Array<{ children:Object }>" :key="index">
                <div class="appera" v-for="(v,i) in item.chidlen" :key="i">
                <div v-if="v.ids===1">
                <div>
                    <div>
                        <h3><p style="width: 5px;height: 30px;background: blue;"> </p>文字评价</h3>
                    </div>
                    <div>
                        <p>
                            {{ v.title }}
                        </p>
                    </div>
                </div>
                <div >
                    <div>
                        <h3><p style="width: 5px;height: 30px;background: blue;"> </p>星级评价</h3>
                    </div>
                    <div>
                        <p> 
                            <span>医生专业度</span> <span>{{ v.good }}</span>
                        </p>
                        <p>
                            <span>服务满意度</span> <span>{{ v.bgood }}</span>
                        </p>
                    </div>
                </div>

                    <div>
                        <div>
                        <h3><p style="width: 5px;height: 30px;background: blue;"> </p>收到的礼物</h3>
                        </div>
                        <div>
                            <img :src="v.img" alt="" style="width: 30px;height: 30px;">
                        </div>
                    </div>
                </div>
                </div>
            </div>
        </main>
  </div>
</template>

<script setup lang="ts">
import { useRouter } from "vue-router";
const router = useRouter();
import {DoctorPl} from '../request/api'
import {ref} from 'vue'
const fant = () => {
  router.go(-1);
};
const list=ref([])


DoctorPl().then((res)=>
{
    console.log(res);
    
    list.value=res.data.data
})


</script>

<style scoped>
.box
{
    width: 100%;
    height: 100%;
}

header
{
    width: 100%;
    height: 50px;
}

main
{
    width: 100%;
    height: 80%;
}


.appraise
{
    width: 100%;
    height: 100%;
}

.appera
{
    margin-left: 30px;
}
</style>